<!DOCTYPE html>
<html>
<head>
    <title>督察模板表</title>
		<#include "/header.html">
            <link rel="stylesheet" href="${request.contextPath}/statics/css/templet.css">
            <link rel="stylesheet" href="${request.contextPath}/statics/css/index.css">

</head>
<body>
<div id="rrapp" v-cloak>
    <div v-show="showList">
        <div class="grid-btn">
            <a class="btn btn-default" @click="checkMblb(null)">全部模板</a>
            <a class="btn btn-default" @click="checkMblb(0)">标准模板</a>
            <a class="btn btn-default" @click="checkMblb(1)">自定义模板</a>
            <a class="btn btn-default" @click="checkMblb(3)">每日必查</a>
            <div class="form-group col-sm-2">
                <input type="text" class="form-control" v-model="q.mbmc" @keyup.enter="query" placeholder="模板名称">
            </div>
            <a class="btn btn-default" @click="query">查询</a>
            <#if shiro.hasPermission("business:supervisetemplet:save")>
                <!--<a class="btn btn-primary" @click="addTpl"><i class="fa fa-plus"></i>&nbsp;新增</a>-->
                <!--<div class="tpl-type-add" v-if="!isAdd">-->
                <span class="add-tpl" @click.stop="addTpl"><i class="fa fa-plus"></i></span>
                <!--</div>-->
            </#if>
        </div>
        <table id="jqGrid"></table>
        <div id="jqGridPager"></div>
    </div>
    <!--<h3 class="content-title clearfix">模板详情-->
        <!--<i class="el-icon-back pull-right"></i> </h3>-->
    <div v-show="!showList" class="panel panel-default">
        <div class="detail-box clearfix">
            <div class="tpl-info pull-left clearfix">
                <span class="tpl-icon pull-left"><img src=""></span>
                <p class="tpl-infos pull-left">
                    <span class="tpl-title">每日必查-海盐督察大队-180612</span>
                    <span class="tpl-arg">
                    <span>海盐公安分局督察大队</span>
                    <span>2018-07-14</span>
                    <span class="status active">使用中</span>
                </span>
                </p>
            </div>
            <div class="tpl-status-btn pull-right">
                <el-button type="success" size="small" icon="el-icon-circle-check-outline">启用</el-button>
                <el-button type="danger" size="small" icon="el-icon-delete">删除</el-button>
                <el-button type="primary" size="small" icon="el-icon-edit-outline">修改</el-button>
            </div>
        </div>
        <div class="flex-box">
            <!-- <div class="flex-left">
                 <h4 class="flex-box-title">
                     模板列表
                 </h4>
                 <div class="flex-box-content">
                     <div class="list-padding-box">
                         <ul class="tpl-type-list">
                             <li class="tpl-type-item" @click="viewTpl('0')">
                                 <span class="tpl-type-title" @click="toggleTplList('default')"><i class="fa" :class="{'fa-minus': showListFlags.bzmbFlag, 'fa-plus': !showListFlags.bzmbFlag}" style="margin-right: 10px"></i> 标准模板</span>
                                 <ul class="tpl-item-list" v-if="showListFlags.bzmbFlag">
                                     <li class="tpl-item" :class="{'active':templetItem.id === publicActiveId}" @click.stop="viewModelInfo(templetItem.id , '0')" v-for="(templetItem , index) in templetItemData" :key="templetItem.id">{{templetItem.mbmc}}</li>
                                 </ul>
                             </li>
                             <li class="tpl-type-item" @click="viewTpl('1')">
                                 <span class="tpl-type-title" @click="toggleTplList('own')"><i class="fa" :class="{'fa-minus': showListFlags.zxmbFlag, 'fa-plus': !showListFlags.zxmbFlag}" style="margin-right: 10px"></i> 自定义模板</span>
                                 <ul class="tpl-item-list" v-if="showListFlags.zxmbFlag">
                                     <li class="tpl-item" :class="{'active':templetItem.id === publicActiveId}" @click.stop="viewModelInfo(templetItem.id , '1')" v-for="(templetItem , index) in templetItemDiyData" :key="templetItem.id">{{templetItem.mbmc}}</li>
                                 </ul>
                             </li>
                           &lt;!&ndash;  <li class="tpl-type-item" @click="viewTpl('2')">
                                 <span class="tpl-type-title" @click="toggleTplList('mine')"><i class="fa" :class="{'fa-minus': showListFlags.wdmbFlag, 'fa-plus': !showListFlags.wdmbFlag}" style="margin-right: 10px"></i> 我的模板</span>
                                 <ul class="tpl-item-list" v-if="showListFlags.wdmbFlag">
                                     <li class="tpl-item" :class="{'active':templetItem.id === publicActiveId}" @click.stop="viewModelInfo(templetItem.id , '2')" v-for="(templetItem , index) in templetItemMineData" :key="templetItem.id">{{templetItem.mbmc}}</li>
                                 </ul>
                             </li>&ndash;&gt;
                             <li class="tpl-type-item" @click="viewTpl('3')">
                                 <span class="tpl-type-title" @click="toggleTplList('daily')"><i class="fa" :class="{'fa-minus': showListFlags.mrbcFlag, 'fa-plus': !showListFlags.mrbcFlag}" style="margin-right: 10px"></i> 每日必查模板</span>
                                 <ul class="tpl-item-list" v-if="showListFlags.mrbcFlag">
                                     <li class="tpl-item"  :class="{'active':templetItem.id === publicActiveId}" @click.stop="viewModelInfo(templetItem.id , '3')" v-for="(templetItem , index) in templetItemDailyData" :key="templetItem.id">{{templetItem.mbmc}}</li>
                                 </ul>
                             </li>
                         </ul>
                         <div class="tpl-type-add" v-if="!isAdd">
                             <span class="add-tpl" @click.stop="addTpl"><i class="fa fa-plus"></i></span>
                         </div>
                     </div>
                 </div>
             </div>-->
            <div class="flex-right" >
                <h4 class="flex-box-title">
                    {{rightTtitle}}
                </h4>
                <div class="flex-right-left">
                    <div class="flex-box-content">
                        <div class="list-padding-box">
                            <h4 class="tpl-view-title" v-if="!isAdd">{{tplTitle}}</h4>
                            <div class="tpl-add-name clearfix" v-if="isAdd">
                                <span class="title">标题：</span>
                                <input class="title-input" type="text" placeholder="请输入标题" id="newTplName">
                                <div class="tpl-type-choose-box" v-if="isAdd">
                                    <input class="choose-type" type="checkbox" id="choose-type"
                                           @click="mblx = mblx === '1' ? '3' : '1'">
                                    <label for="choose-type">设为每日必查模板</label>
                                </div>
                            </div>

                        <ul class="tpl-view-list" v-if="!isAdd">
                            <li class="tpl-view-item"
                                :class="{'first-level': templetInfo.levelNum === '1' , 'second-level': templetInfo.levelNum === '2' , 'third-level': templetInfo.levelNum === '3' , 'fourth-level': templetInfo.levelNum === '4'}"
                                v-for="(templetInfo , index) in templetInfoData"
                                :key="templetInfoData.id"
                                @click.stop="viewChildTpl('templetInfoShowFlagArr', index)"
                                v-if="templetInfoShowFlagArr[index].showFlag"
                            >
                                <span class="first-level-item">
                                    <span class="item-index" v-if="templetInfoData.levelNum === '4'">
                                        <!--<i class="fa" :class="{'fa-minus': templetInfoShowFlagArr[index].showFlag, 'fa-plus': !templetInfoShowFlagArr[index].showFlag}" style="margin-right: 10px"></i>-->

                                        <!--{{templetInfo.parentId + '.' + templetInfo.id}}-->
                                    </span>
                                    <span class="tpl-view-item-content">{{templetInfo.levelNum | getSerialNum}}{{templetInfo.questionDescription}}</span>
                                </span>
                            </li>
                        </ul>
                        <!--<ul class="tpl-view-list add" v-if="isAdd">-->
                            <!--<li class="tpl-view-item"-->
                                <!--:class="{'first-level': templetInfo.levelNum === '1' , 'second-level': templetInfo.levelNum === '2' , 'third-level': templetInfo.levelNum === '3' , 'fourth-level': templetInfo.levelNum === '4'}"-->
                                <!--v-for="(templetInfo , index) in templetInfoDataAdd"-->
                                <!--:key="templetInfoData.id"-->
                                <!--@click.stop="viewChildTpl(index)">-->
                                <!--<span class="first-level-item">-->
                                    <!--<span class="item-index">-->
                                        <!--&lt;!&ndash;<i class="fa" :class="{'fa-minus': templetInfoShowFlagArr[index].showFlag, 'fa-plus': !templetInfoShowFlagArr[index].showFlag}" style="margin-right: 10px"></i>&ndash;&gt;-->
                                        <!--&lt;!&ndash;{{index + 1 + '.'}}&ndash;&gt;-->
                                    <!--</span>-->
                                    <!--<span class="tpl-view-item-content">{{templetInfo.levelNum | getSerialNumToAdd}}{{templetInfo.questionDescription}}</span>-->
                                <!--</span>-->
                            <!--</li>-->
                        <!--</ul>-->
                        <el-tree
                            v-if="isAdd"
                            :data="data"
                            :props="props"
                            :node-key="data.id"
                            ref="tree"
                            empty-text="暂无选中问题项"
                        >
                        </el-tree>
                    </div>
                </div>
            </div>
            <div class="flex-right-right" v-if="isAdd">
                <div class="flex-box-content">
                    <div class="list-padding-box">
                        <h4 class="tpl-view-title">选择问题项</h4>
                        <!--<ul class="tpl-view-list">-->
                            <!--<li class="tpl-view-item"-->
                                <!--:class="{'first-level': templetInfo.levelNum === '1' , 'second-level': templetInfo.levelNum === '2' , 'third-level': templetInfo.levelNum === '3' , 'fourth-level': templetInfo.levelNum === '4'}"-->
                                <!--v-for="(templetInfo , index) in templetQusationData"-->
                                <!--:key="templetQusationData.id"-->
                                <!--@click.stop="viewChildTpl('templetQusationShowFlagArr', index)"-->
                                <!--v-if="templetQusationShowFlagArr[index].showFlag"-->
                            <!--&gt;-->
                                <!--<span class="first-level-item">-->
                                    <!--<input class="check-tpl" type="checkbox" @click.stop="checkQuastion(templetInfo, index)">-->
                                    <!--&lt;!&ndash;<span class="item-index"><i class="fa" :class="{'fa-minus': templetQusationShowFlagArr[index].showFlag, 'fa-plus': !templetQusationShowFlagArr[index].showFlag}" style="margin-right: 10px"></i>&lt;!&ndash;{{index + 1 + '.'}}&ndash;&gt;</span>&ndash;&gt;-->
                                    <!--<span class="tpl-view-item-content">{{templetInfo.levelNum | getSerialNum}}{{templetInfo.questionDescription}}</span>-->
                                <!--</span>-->
                            <!--</li>-->
                        <!--</ul>-->
                        <el-tree
                                :data="data2"
                                :props="props2"
                                show-checkbox
                                node-key="id"
                                @check="handleCheckChange"
                                ref="tree2"
                                empty-text="暂无问题项"
                        >
                        </el-tree>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="bottom-btn-box" v-if="isAdd">
        <button type="button" class="btn btn-cancel tpl-cancel" @click.stop="cancelAddTpl">取消</button>
        <button type="button" class="btn btn-submit tpl-submit" @click.stop="comfirmAddTpl">确定</button>
    </div>
</div>

<script src="${request.contextPath}/statics/js/modules/business/supervisetemplet.js?_${.now?long}"></script>
<script src="${request.contextPath}/statics/plugins/element/index.js"></script>
</body>
</html>